<template>
	<view id="week">
		<u-cell-group>
				<u-cell title="一周工作统计"></u-cell>
		</u-cell-group>
		<view class="ring">
			<qiun-data-charts type="ring" :opts="opts1" :chartData="chartData1" />
		</view>
		<u-cell-group>
				<u-cell title="近一周巡查次数"></u-cell>
			</u-cell-group>
		<view class="line">
			<qiun-data-charts type="line" :opts="opts2" :chartData="chartData2" />
		</view>
	</view>
</template>

<script>
	import { getWorkLine, getWorkPie } from '@/api'
	export default {
		data() {
			return {
				chartData1: {
					series: [{
						data: [{
								name: '已完结',
								value: 0
							},
							{
								name: '已整改',
								value: 0
							},
							{
								name: '超期未整改',
								value: 0
							}
						]
					}]
				},
				chartData2: {
					categories: [],
					series: [{
							name: "已解决",
							data: []
						},
						{
							name: "未解决",
							data: []
						},
						{
							name: "超时",
							data: []
						}
					]
				},
				opts1: {
					update: true,
					rotate: false,
					rotateLock: false,
					color: ["#1890FF", "#9A60B4", "#EE6666"],
					padding: [5, 5, 5, 5],
					dataLabel: true,
					legend: {
						show: true,
						position: "right",
						lineHeight: 25
					},
					title: {
						name: "",
						fontSize: 25,
						color: "#1890FF"
					},
					subtitle: false,
					extra: {
						ring: {
							ringWidth: 20,
							activeOpacity: 0.5,
							activeRadius: 10,
							offsetAngle: 0,
							labelWidth: 15,
							border: false,
							borderWidth: 3,
							borderColor: "#FFFFFF"
						}
					}
				},
				opts2: {
					update: true,
					color: ["#1890FF", "#9A60B4", "#EE6666"],
					legend: {},
					xAxis: {
						disableGrid: true
					},
					yAxis: {
						gridType: "dash",
						dashLength: 2
					},
					extra: {
						line: {
							type: "straight",
							width: 2,
							activeType: "hollow"
						}
					}
				}
			}
		},
		mounted () {
			this.getWork()
		},
		methods: {
			getWork () {
				getWorkLine().then(res => {
					const data = res.data.data
					for (const k in data) {
						this.chartData2.categories.push(k)
						this.chartData2.series[0].data.push(data[k].status1)
						this.chartData2.series[1].data.push(data[k].rectify1)
						this.chartData2.series[2].data.push(data[k].rectifyStatus0)
					}
				})
				getWorkPie().then(res => {
					this.chartData1.series[0].data[0].value = res.data.data.status1
					this.chartData1.series[0].data[1].value = res.data.data.rectify1
					this.chartData1.series[0].data[2].value = res.data.data.rectifyStatus0
					this.opts1.title.name = (res.data.data.status1 + res.data.data.rectify1 + res.data.data.rectifyStatus0).toString() || "0"
				})
			}
		}
	}
</script>

<style>
</style>
